import React, { Component } from "react";
import "./App.css";
import { jssPreset } from "@material-ui/styles";
import StylesProvider from "@material-ui/styles/StylesProvider";
import { create } from "jss";
import ThemeProvider from "@material-ui/styles/ThemeProvider";
import Main from "./views/Main";
import { HashRouter, Route, Router, Switch } from "react-router-dom";
import createHashHistory from "history/createHashHistory";
import DetailInfo from "./views/DetailInfo";

const jss = create(jssPreset());

class App extends Component {
  public render() {
    return (
      <div className="App">
        <StylesProvider jss={jss}>
          <HashRouter>
            <Router history={createHashHistory()}>
              <Switch>
                <Route component={DetailInfo} path={"/detail/:id"} />
                <Route component={Main} path={"/"} />
              </Switch>
            </Router>
          </HashRouter>
        </StylesProvider>
      </div>
    );
  }
}

export default App;
